<!-- src/views/Management/SystemManage.vue -->
<template>
  <div class="management-layout">
    <div class="sidebar">
      <SidebarMenu/>
    </div>
    <div class="content">
      <router-view/>
    </div>
  </div>
</template>

<script setup>
import SidebarMenu from '../views/system/menu/SidebarMenu.vue'
</script>

<style scoped>
.management-layout {
  display: flex;
  width: 100%;
  height: 100vh; /* 或根据需要设置高度 */
}

.sidebar {
  width: 200px;
  flex-shrink: 0; /* 防止在空间不足时被压缩 */
}

.content {
  flex: 1; /* 关键：自动占满剩余空间 */
  /* 可选：添加内边距或背景 */
  padding: 20px;
  background-color: #f5f7fa;
}
</style>
